<!DOCTYPE html>
<html>
<head>
    <title>搜禾一小时购</title>
    <meta charset="utf-8">
	<meta name="viewport" content="width=device-width, initial-scale=1">
	
    <link href="{:_SKIN}/weixin/miao/css/style.css" rel="stylesheet" type="text/css"/>
    <link href="{:_SKIN}/weixin/miao/css/jquery.bxslider.css" rel="stylesheet" type="text/css">
	<link rel="stylesheet" type="text/css" href="http://at.alicdn.com/t/font_400457_mqmlp1g1kh1qyqfr.css"/>
	<link rel="stylesheet" type="text/css" href="{:_SKIN}/weixin/miao/css/font-icon.css"/>
	<script type="text/javascript" src="{:_SKIN}/weixin/miao/js/jquery-1.10.2.min.js"></script>
    <script type="text/javascript" src="{:_SKIN}/weixin/miao/js/jquery.bxslider.js"></script>
    <style type="text/css">
    body{max-width: 500px;}
   	.shop-0{height:54px;background:#e01121;line-height:54px;color:#FFF;text-align:center}
	.zuo{float:left}
	.you{float:right}
	.xw_90{width:90%;margin:0 auto}
	.neilian{display:inline}
    .ui-content{ padding:0px; margin:0px;}
	.bx-wrapper .bx-viewport{ box-shadow:none; border:none; background:none; left:0;}
	.bx-wrapper .bx-prev{background: url({:_SKIN}/weixin/miao/images/controls.png) no-repeat 0 -32px; left:0px;}
	.bx-wrapper .bx-next{background: url({:_SKIN}/weixin/miao/images/controls.png) no-repeat -43px -32px; right:0px;}
    #returnTop{position: fixed;bottom:60px;right:10px;width: 44px;height: 44px;background: url({:_SKIN}/weixin/miao/images/returntop.png) no-repeat;background-size:contain;}
    footer{position: fixed;bottom:0;height: 50px;width: 100%;border-top: 1px solid #eee;background:#fff;z-index: 1;}
    footer a{display:block;width:80%;margin:10px auto;border-radius:10px;font-size: 1.5em;text-align:center;color: #ff5000;}
    .tab{margin: 0 auto;}
    .tab ul{margin: 0 auto;width: 100%;text-align: center;display: inline-block;}
    .tab ul li{float: left;width: 24.6%;text-align: center;margin: 5px 0;border-left: 1px solid #F2F2F2;display: inline-block;}
    .tab ul li:first-child{border: 0;}
    .add{color: #C90507;font-weight: bold;}
    .left{display: none;}
    .left-1{display: inline;color: #e11121;font-size: 12px;padding-left: 5px;}
    .left-2{font-size: 12px;color: #FFFFFF;background-color: #e01125;display: inline-block;width: 60px;text-align: center;float: right;height: 30px;line-height: 30px;border-radius: 4px;}
    </style>
	
</head>
<body>

<div data-role="page" id="mypage"> 
	<div class="shop-0">
			<div class="xw_90">
				<a href="javascript:history.go(-1)">
					<i class="iconfont icon-fanhui zuo bai font_20"></i>
				</a>
				<h3 class="neilian">一小时购</h3>
				<a href="#">
					<i class="iconfont icon-shouye you bai font_20"></i>
				</a>
			</div>
	</div>
	<div class="tab">
		<ul>
			<li class="add">
				<p>{:date('H')}:00</p>
				<p>￥{$t.s1}</p>
			</li>
			<li>
				<p>{:date('H')}:15</p>
				<p>￥{$t.s2}</p>
			</li>
			<li>
				<p>{:date('H')}:30</p>
				<p>￥{$t.s3}</p>
			</li>
			<li>
				<p>{:date('H')}:45</p>
				<p>￥{$t.s4}</p>
			</li>
		</ul>
		<div class="clear"></div>
	</div>
 	<div role="main" class="ui-content">
		<ul class="sliderlist">
            <li>
                <div class="miaosha_list">
                <div class="img">
                    <div style="max-height: 320px; overflow: hidden;">
                        <img src="{:config('cdn')}{$t.pic}" >
                        <div class="dw"><img src="{:_SKIN}/weixin/miao/picture/hour.png"></div>
                    </div>
                    <!--<div>
                        <img src="picture/miaosha_img2.jpg">
                        <div class="dw"><img src="picture/miaosha_position.png"></div>
                    </div>
                    <div>
                        <img src="picture/miaosha_img3.jpg">
                        <div class="dw"><img src="picture/miaosha_position.png"></div>
                    </div>-->
                </div>
                <div class="textbox">
                    <div class="text ppp">
                        {$t.name}
                    </div>
                </div>
                <div class="money">
                    <div class="left" style="display: block;" >
                        <h2 style="margin-bottom: 10px;margin-left: 8px"> {$t.s1}<span>{$t.s1+50}</span><p class="left-1">人气{$t.click}</p></h2>
                    </div>
                    <div class="left">
                        <h2 style="margin-bottom: 10px;margin-left: 8px"> {$t.s2}<span>{$t.s1+50}</span><p class="left-1">人气{$t.click}</p></h2>
                    </div>
                    <div class="left">
                        <h2 style="margin-bottom: 10px;margin-left: 8px"> {$t.s3}<span>{$t.s1+50}</span><p class="left-1">人气{$t.click}</p></h2>
                    </div>
                    <div class="left">
                        <h2 style="margin-bottom: 10px;margin-left: 8px">{$t.s4}<span>{$t.s1+50}</span><p class="left-1">人气{$t.click}</p></h2>
                    </div>
                    
                </div>
                <div class="tab">
                    <p class="tab-hd"><span class="on" style="background-color:#e01222;border: none;margin-bottom: 15px;border-radius: 0 ">产品详情</span></p>
                    <div class="tab-nr">
                       <div class="tab-innr show">
                         {$t.desc}
                       </div> 
                      
                    </div>
                </div>
            </div>
            </li>
        </ul>    
  	</div>
</div>
    <div id="returnTop"></div>
   <footer>



   

        <a href="{:url('pay/weixin/hourorder')}?id={$t.id}&jg={$jg}" style="background-color: #e01222;color: #fff">立即抢购</a>

       





    </footer>
<script type="text/javascript">

$(document).ready(function () {
    $(".tab img").css('width','100%');

    // 返回顶部
    $('body').scrollTop(0);
    $("#returnTop").bind('click',function () {
            var speed=500;
            $('body,html').animate({ scrollTop: 0 }, speed);
            return false;
    });
    
    //tab切换
    var aa = $('.tab ul li');
    var bb = $('.left');
   
    aa.click(function(){
    	
    	var i = $(this).index();
    	aa.removeClass();
    	$(this).addClass('add');
    	bb.hide();
    	bb.eq(i).show();
    });


    setTimeout(function(){
	     $('.left-2').css('background-color','#CCCCCC');      	  
	
	           	
	           	
	},3000);
    
    });


</script>

</body>
</html>
